From bc13a45d3dfa0109ed043e63a9afbc7266b447e2 Mon Sep 17 00:00:00 2001
From: Valentin Popov <valentin@popov.link>
Date: Thu, 24 Oct 2024 19:50:34 +0000
Subject: Updated the structure of the post's page

---
 src/pages/blog/[...slug].astro | 28 +++++++++++++++++++---------
 1 file changed, 19 insertions(+), 9 deletions(-)

(limited to 'src/pages/blog/[...slug].astro')

diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro
index 63d2c98..9445673 100644
--- a/src/pages/blog/[...slug].astro
+++ b/src/pages/blog/[...slug].astro
@@ -18,30 +18,40 @@ export async function getStaticPaths() {
 }
 
 const post = Astro.props;
-const { Content } = await post.render();
+const { Content, remarkPluginFrontmatter } = await post.render();
 const formattedDate = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY");
 ---
 
-<Layout description={post.data.description} title={post.data.title}>
-	<article>
-		<section>
-			<h1>{post.data.title}</h1>
-		</section>
+<style lang="scss">
+	@import "../../scss/_variables.scss";
 
-		<section>
-			<Content />
-		</section>
+	p {
+		opacity: 0.5;
+	}
+</style>
 
+<Layout description={post.data.description} title={post.data.title}>
+	<article>
 		<section>
 			<p>
 				<small>
 					Posted
 					<time datetime={post.data.pubDate.toISOString()}>{formattedDate}</time>
 					by&nbsp;{post.data.author}
+					<span>&nbsp;•&nbsp;</span>
+					<span>{remarkPluginFrontmatter.minutesRead}</span>
 				</small>
 			</p>
 		</section>
 
+		<section>
+			<h1>{post.data.title}</h1>
+		</section>
+
+		<section>
+			<Content />
+		</section>
+
 		<section>
 			<Comments />
 		</section>
-- 
cgit v1.2.3